<template>
	<div class="divider">
		<span>{{ title }}</span>
		<div>
			<div class="circle"></div>
			<div class="line"></div>
		</div>
	</div>
</template>

<script>
export default {
	props: {
		title: String,
	},
	data() {
		return {

		}
	},
	methods: {

	}
}
</script>


<style scoped lang="less">
.divider {
	display: flex;
	align-items: center;
	margin-bottom: 50px;
	span {
		color: #1ba6ff;
		font-size: 40px;
		margin-right: 36px;
	}
	> div {
		flex: 1;
		display: flex;
		align-items: center;
		.circle {
			width: 14px;
			height: 14px;
			background: linear-gradient(180deg, #1bb7ff 0%, #1b7bff 100%);
			border-radius: 50%;
		}
		.line {
			flex: 1;
			height: 2px;
			background: rgba(93, 185, 244, 0.25);
		}
	}
}
</style>
